<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <!-- 操作按钮区域 -->
    <div class="table-operator">
      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
      <a-button type="primary" icon="download" @click="handleExportXls('cou_course_arrange_atom')">导出</a-button>
      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
        <a-button type="primary" icon="import">导入</a-button>
      </a-upload>
      <!-- 高级查询区域 -->
      <j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>
      <a-dropdown v-if="selectedRowKeys.length > 0">
        <a-menu slot="overlay">
          <a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
        </a-menu>
        <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>
      </a-dropdown>
      <template>
        <span style="float:right;">
          <a @click="searchQuery()"><a-icon type="sync" />刷新</a>
          <a-divider type="vertical" />
          <a-button v-print="'#datatable'" ghost type="primary">打印</a-button>
        </span>
      </template>
      <template>
        <span style="float:right;">
          <a @click="searchQuery()"><a-icon type="sync" />刷新</a>
          <a-divider type="vertical" />
          <a-button v-print="'#datatable'" ghost type="primary">打印</a-button>
        </span>
      </template>
    </div>

    <!-- table区域-begin -->
    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div>
<!--      <a-table-->
<!--        ref="table"-->
<!--        size="middle"-->
<!--        :scroll="{x:true}"-->
<!--        bordered-->
<!--        rowKey="id"-->
<!--        :columns="columns1"-->
<!--        :dataSource="courseData1"-->
<!--        :pagination="ipagination"-->
<!--        :loading="loading"-->
<!--        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"-->
<!--        class="j-table-force-nowrap"-->
<!--        @change="handleTableChange">-->
<!--      </a-table>-->
      <div style='margin: 0px 5px 10px 5px;'>
        <a-form-model-item label="选择班级" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="id">
          <a-select v-model="model.id" placeholder="请选择班级" :getPopupContainer="(target) => target.parentNode" style='width: 300px;'>
            <a-select-option v-for="item in classAllData" :key="item.value">{{ item.label }}</a-select-option>
          </a-select>
          <a-button @click="handleGetData(4)" type="primary" :class="{ newStyle:0===number}" style='margin-left: 10px;'>查看课表</a-button>
        </a-form-model-item>

        <a-button @click="handleGetData(4)" type="primary" :class="{ newStyle:0===number}">科 目</a-button>
        <a-button @click="handleGetData(3)" type="primary" :class="{ newStyle:0===number}" style='margin-left: 20px;'>教 师</a-button>
        <a-button @click="handleGetData(2)" type="primary" :class="{ newStyle:0===number}"  style='margin-left: 20px;'>教 室</a-button>
        <a-button @click="handleGetAllData()" type="primary" :class="{ newStyle:1===number}"  style='margin-left: 20px;'>详细课表</a-button>
        <!-- 调换科目 -->
        <a-button type="primary" @click="handleEditCourseModal" style='margin-left: 20px;'>
          调 课
        </a-button>
        <a-modal v-model="handleEditCourseVisible" title="科目调换" @ok="handleEditCourseOk">
          <p>Some contents...</p>
          <p>Some contents...</p>
          <p>Some contents...</p>
        </a-modal>
      </div>
      <div style='float:left;text-align: center;' v-show="0===number">
        <div style='width: 100px;float: left;'>
          <div  class='week-t'><span>第几节</span></div>
          <div class='week-c' style='font-weight: bold;background-color: #e2e2e2;' v-for='item in courseData1' :key='item' slot='item'><span>第 </span><span>{{ item.courArraAtomSection }}</span><span> 节</span></div>
        </div>
        <div style='width: 120px;float: left;'>
          <div class='week-t'><span>上课时间</span></div>
          <div class='week-c' v-for='item in courseData1' :key='item' slot='item'><span>{{ item.courArraAtomStartTime }}</span> <span> -- </span><span>{{ item.courArraAtomEndTime }}</span></div>
        </div>
        <div style='width: 150px;float: left;'>
          <div class='week-t'><span>星期一</span></div>
          <div class='week-c' v-for='item in courseData1' :key='item' slot='item' @click='selectBt(item.id,item.relObjId)'><span>{{ item.relObjName }}</span></div>
        </div>
        <div style='width: 150px;float: left;'>
          <div class='week-t'><span>星期二</span></div>
          <div class='week-c' v-for='item in courseData2' :key='item' slot='item' @click='selectBt(item.id,item.relObjId)'><span>{{ item.relObjName }}</span></div>
        </div>
        <div style='width: 150px;float: left;'>
          <div class='week-t'><span>星期三</span></div>
          <div class='week-c' v-for='item in courseData3' :key='item' slot='item' @click='selectBt(item.id,item.relObjId)'><span>{{ item.relObjName }}</span></div>
        </div>
        <div style='width: 150px;float: left;'>
          <div class='week-t'><span>星期四</span></div>
          <div class='week-c' v-for='item in courseData4' :key='item' slot='item' @click='selectBt(item.id,item.relObjId)'><span>{{ item.relObjName }}</span></div>
        </div>
        <div style='width: 150px;float: left;'>
          <div class='week-t'><span>星期五</span></div>
          <div class='week-c' v-for='item in courseData5' :key='item' slot='item' @click='selectBt(item.id,item.relObjId)'><span>{{ item.relObjName }}</span></div>
        </div>
        <div style='width: 150px;float: left;'>
          <div class='week-t'><span>星期六</span></div>
          <div class='week-c' v-for='item in courseData6' :key='item' slot='item' @click='selectBt(item.id,item.relObjId)'><span>{{ item.relObjName }}</span></div>
        </div>
        <div style='width: 150px;float: left;'>
          <div class='week-t'><span>星期天</span></div>
          <div class='week-c' v-for='item in courseData7' :key='item' slot='item' @click='selectBt(item.id,item.relObjId)'><span>{{ item.relObjName }}</span></div>
        </div>
      </div>

      <!-- 切换详细 -->
      <div v-show="1===number">
        <H2>我是详细课表展示...正在开发...</H2>
      </div>

    </div>

    <cou-course-arrange-atom-modal ref="modalForm" @ok="modalFormOk"></cou-course-arrange-atom-modal>
  </a-card>
</template>

<script>

  import '@/assets/less/TableExpand.less'
  import { mixinDevice } from '@/utils/mixin'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import CouCourseArrangeAtomModal from './modules/CouCourseArrangeAtomModal'
  import { getCourseDataList } from '@api/couCourseArrangeAtom'
  import { getAllClass } from '@api/commonAPI'

  export default {
    name: 'CouCourseArrangeAtomList',
    mixins:[JeecgListMixin, mixinDevice],
    components: {
      CouCourseArrangeAtomModal
    },
    data () {
      return {
        description: 'cou_course_arrange_atom管理页面',
        // 表头
        // columns1: [
        //   {
        //     title: '#',
        //     dataIndex: '',
        //     key:'rowIndex',
        //     width:60,
        //     align:"center",
        //     customRender:function (t,r,index) {
        //       return parseInt(index)+1;
        //     }
        //   },
        //   {
        //     title:'上课时间',
        //     align:"center",
        //     width:100,
        //     dataIndex: 'courArraAtomStartTime'
        //   },
        //   {
        //     title:'下课时间',
        //     align:"center",
        //     width:100,
        //     dataIndex: 'courArraAtomEndTime'
        //   },
        //   {
        //     title:'周一',
        //     align:"center",
        //     dataIndex: 'relObjId'
        //   },
        // ],
        // columns2: [
        //   {
        //     title:'周二',
        //     align:"center",
        //     dataIndex: 'relObjId'
        //   },
        // ],
        url: {
          list: "/coursearrangeatom/couCourseArrangeAtom/list",
          delete: "/coursearrangeatom/couCourseArrangeAtom/delete",
          deleteBatch: "/coursearrangeatom/couCourseArrangeAtom/deleteBatch",
          exportXlsUrl: "/coursearrangeatom/couCourseArrangeAtom/exportXls",
          importExcelUrl: "coursearrangeatom/couCourseArrangeAtom/importExcel",

        },
        dictOptions:{},
        superFieldList:[],
        //课表科目查询
        courseData1: [],
        courseData2: [],
        courseData3: [],
        courseData4: [],
        courseData5: [],
        courseData6: [],
        courseData7: [],
        number: 0,
        //详细课表  数据初始化
        //下拉班级数据
        classAllData:[],
        model:{
        },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        handleEditCourseId: null,
        handleEditCourseRelObjId: null,
        handleEditCourseVisible: false,
      }
    },
    created() {
    this.getSuperFieldList();
    this.getCourseData();
    this.getAllClassData();
    },
    computed: {
      importExcelUrl: function(){
        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
      },
    },
    methods: {
      selectBt(id,relObjId){
        this.handleEditCourseId = id
        this.handleEditCourseRelObjId = relObjId
        console.log("===id===" + this.handleEditCourseId)
      },





      handleEditCourseModal(){
        if (this.handleEditCourseId === null){
          alert("请先选择需要调换的科目，点击即可选择！")
        }else {
          this.handleEditCourseVisible = true
        }
      },
      handleEditCourseOk(e) {
        console.log(e);
        this.handleEditCourseVisible = false;
        this.handleEditCourseId = null;
        this.handleEditCourseRelObjId = null;
      },
      initDictConfig(){
      },
      async getAllClassData() {
        let res = await getAllClass()
        this.classAllData = []
        res.result.forEach(item => {
          this.classAllData.push({
            label: item.className,
            value: item.id
          })
        })
      },
      handleGetData(ttype){
        this.number = 0; //切换数据列表
        //初始化
        this.courseData1 = [],
        this.courseData2 = [],
        this.courseData3 = [],
        this.courseData4 = [],
        this.courseData5 = [],
        this. courseData6 = [],
        this.courseData7 = [],
        this.getCourseData(ttype)
      },
      handleGetAllData(ttype){
        this.number = 1; //切换数据列表
      },
      async getCourseData(typeNum) {
        let init_typeNum = 4;
        if(typeNum == null || typeNum ==0 || typeNum == ""){
          typeNum = init_typeNum
        }
        let params = {
          // courseArrangeId: "26328475482",
          // targetObjId: "1494244019402743810",
          targetObjId: this.model.id,
          relObjTtype: typeNum,
        }
        let res = await getCourseDataList(params)
        if (res && res.code === 200) {
          let datas = res.result
          this.courseData1 = datas.filter((item) => {
            return item.courArraAtomWeekday === 1
          })
          this.courseData2 = datas.filter((item) => {
            return item.courArraAtomWeekday === 2
          })
          this.courseData3 = datas.filter((item) => {
            return item.courArraAtomWeekday === 3
          })
          this.courseData4 = datas.filter((item) => {
            return item.courArraAtomWeekday === 4
          })
          this.courseData5 = datas.filter((item) => {
            return item.courArraAtomWeekday === 5
          })
          this.courseData6 = datas.filter((item) => {
            return item.courArraAtomWeekday === 6
          })
          this.courseData7 = datas.filter((item) => {
            return item.courArraAtomWeekday === 7
          })
        } else {
          this.$message.error("暂无数据")
        }
      },
      getSuperFieldList(){
        let fieldList=[];
        fieldList.push({type:'string',value:'courseArrangeId',text:'课表id',dictCode:''})
        fieldList.push({type:'string',value:'targetObjId',text:'目标对象id(班级id(默认)，场地id，老师id，科目id,学生id)，表示该课表应用对象',dictCode:''})
        fieldList.push({type:'string',value:'relObjNameEn',text:'关联对象类型英文名称（班级cou_class、教室fac_classroom、老师tea_teacher、科目cou_subject、学生stu_student）',dictCode:''})
        fieldList.push({type:'string',value:'relObjNameCn',text:'关联对象类型中文名称（班级cou_class、教室fac_classroom、老师tea_teacher、科目cou_subject、学生stu_student）',dictCode:''})
        fieldList.push({type:'int',value:'relObjTtype',text:'关联对象类型(1:班级;2:教室,3.老师;4.科目5学生)',dictCode:''})
        fieldList.push({type:'string',value:'relObjId',text:'关联对象id',dictCode:''})
        fieldList.push({type:'int',value:'courArraAtomWeekday',text:'星期数',dictCode:''})
        fieldList.push({type:'int',value:'courArraAtomSection',text:'节次',dictCode:''})
        fieldList.push({type:'string',value:'courArraAtomSectionname',text:'节次名称',dictCode:''})
        fieldList.push({type:'int',value:'courArraAtomIzSingle',text:'单双周标识(1单周（默认），2双周 3三周 4四周)',dictCode:''})
        fieldList.push({type:'string',value:'courArraAtomStartTime',text:'开始时间',dictCode:''})
        fieldList.push({type:'string',value:'courArraAtomEndTime',text:'结束时间',dictCode:''})
        fieldList.push({type:'int',value:'izOpen',text:'是否启用（0否停用，1是启用）',dictCode:''})
        fieldList.push({type:'int',value:'izDelete',text:'是否删除（0否 1是已删除）',dictCode:''})
        fieldList.push({type:'string',value:'tenantId',text:'学校编码',dictCode:''})
        fieldList.push({type:'date',value:'createTime',text:'创建时间'})
        fieldList.push({type:'string',value:'createUser',text:'创建人',dictCode:''})
        fieldList.push({type:'date',value:'editTime',text:'编辑时间'})
        fieldList.push({type:'string',value:'editUser',text:'编辑人',dictCode:''})
        this.superFieldList = fieldList
      },
      //调课

    }
  }
</script>
<style scoped>
.week-t {
  background-color: #e2e2e2;
  height: 40px;
  border: 1.5px solid #ffffff;
  color: #151515;
  line-height: 40px;
  font-weight: bold;
}
  .week-c {
    height: 50px;
    border: 1.5px solid #adadad;
    line-height: 50px;
  }
.week-c:hover {
  box-shadow: 0px 0px 3px #7f7f7f;
  background-color: #dcdcdc;
}
  @import '~@assets/less/common.less';
</style>